<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        .box{
            width: 430px;
            
            height: 100vh;
        }
     .fish{
        display: flex;
     }
     .imgs{
        width: 200px;
        height: 130px;
     }
     .txt{
    font-weight: bold;
    font-size: 20px;
     }
     .one{
        color: red;
        position: relative;
        top: -5px;
        left: 13px;
     }
   .two
   {
    color: gray;
    
   }
   a{
    text-decoration: none;
    color: gray;
    position: relative;
    left: 50px;
   }
   .bottom{
    width: 430px;
    
 
   }
   .top{
    display: flex;
    margin-bottom: 30px;
   }
   .hot{
    width: 25px;
    height: 25px;
    top: 3px;
    margin-right: 8px;
   }
   .again{
    width: 18px;
    height: 18px;
    margin-right: 3px;
  

   }
   .tt{
    position: relative;
    left: 235px;
    margin-left: 10px;
    color: red;
    font-weight: bolder;
   }
   .dd{
    font-size: 20px;
   }
    </style>
</head>
<body>
    <div class="box">
        <div class="top">
            <div class="dd"><img src="./img/icon-play.png" alt="" class="hot">热门视频</div>
            <div class="tt"><img src="./img/icon-sx2.png" alt="" class="again">换一换</div>
        </div>

        <div class="bottom">
            <div class="fish">
            <div >
                <img src="./img/toutiao-02.jpeg" alt="" class="imgs">
            </div>
            <div class="right">
                <div class="txt">
                无论做什么鱼：最忌放盐和料酒研制
                 </div>
            
                <p class="one">1万评论</p>
                <p class="two">148万次观看<a href="">司马南频道</a></p>
                
            </div>

            
         </div>
         <div class="bottom">
            <div class="fish">
            <div >
                <img src="./img/toutiao-02.jpeg" alt="" class="imgs">
            </div>
            <div class="right">
                <div class="txt">
                无论做什么鱼：最忌放盐和料酒研制
                 </div>
            
                <p class="one">1万评论</p>
                <p class="two">148万次观看<a href="">司马南频道</a></p>
                
            </div>

            
         </div>
         <div class="bottom">
            <div class="fish">
            <div >
                <img src="./img/toutiao-02.jpeg" alt="" class="imgs">
            </div>
            <div class="right">
                <div class="txt">
                无论做什么鱼：最忌放盐和料酒研制
                 </div>
            
                <p class="one">1万评论</p>
                <p class="two">148万次观看<a href="">司马南频道</a></p>
                
            </div>

            
         </div>
         <div class="bottom">
            <div class="fish">
            <div >
                <img src="./img/toutiao-02.jpeg" alt="" class="imgs">
            </div>
            <div class="right">
                <div class="txt">
                无论做什么鱼：最忌放盐和料酒研制
                 </div>
            
                <p class="one">1万评论</p>
                <p class="two">148万次观看<a href="">司马南频道</a></p>
                
            </div>

            
         </div>
      
    </div>
    </div>
</body>
</html>